<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
</head>

<body style="margin: auto;width: 100%;">
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:400px; width:800px;"></div>
<script src="js/echarts-all.js"></script>
<!--<script src="js/params.js"></script>-->
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts图表
    var myChart = echarts.init(document.getElementById('main'));

    option = {
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient : 'vertical',
            x : 'left',
            data:['18-35岁','36-45岁','46岁以上']
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: true},
                dataView : {show: true, readOnly: false},
                magicType : {
                    show: true,
                    type: ['pie', 'funnel']
                },
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : false,
        series : [
            {
                name:'渝东南',
                type:'pie',
                selectedMode: 'single',
                radius : [0, 70],

                // for funnel
                x: '20%',
                width: '40%',
                funnelAlign: 'right',
                max: 1548,

                itemStyle : {
                    normal : {
                        label : {
                            position : 'inner'
                        },
                        labelLine : {
                            show : false
                        }
                    }
                },
                data:[
                    {value:90, name:'18-35岁'},
                    {value:30, name:'36-45岁'},
                    {value:55, name:'46岁以上',selected:true}
                ]
            },
            {
                name:'主城9区',
                type:'pie',
                radius : [100, 140],

                // for funnel
                x: '60%',
                width: '35%',
                funnelAlign: 'left',
                max: 1048,

                data:[
                    {value:60, name:'男'},
                    {value:30, name:'女'},


                    {value:20, name:'男'},
                    {value:10, name:'女'},


                    {value:25, name:'男'},
                    {value:30, name:'女'}
                ]
            }
        ]
    };

    // 为echarts对象加载数据
    myChart.setOption(option);
</script>
</body>